
import { compileNode } from "./compileNode.js"
import { compileToFuncton } from "./compileToFuncton.js"
import { mountComponent } from "./mountComponent.js"

/**
 * 编译器
 * @param {*} vm 
 */
export function mount(vm) {
  // 如果没有配置render配置项，则编译生成render函数

  if (!vm.$options.render) {
    // 获取模板
    let template = ''
    // 如果有配置template，则直接使用模板
    if (vm.$options.template) {
      template = vm.$options.template
    } else if (vm.$options.el) {
      // 配置了el挂载点，则使用该点作为模板
      const elDom = document.querySelector(vm.$options.el)
      //
      //
      template = elDom.outerHTML
      // 记录挂载点， _update会用到
      vm.$el = elDom
    }
    // 生成渲染函数
    const render = compileToFuncton(template)
    // 将渲染函数挂载到$options上
    vm.$options.render = render

  }

  // 进入挂载阶段
  mountComponent(vm)
  // 最后设置响应式更新
  // if (vm.$options.el) {
  //   compileNode(Array.from(document.querySelector(vm.$options.el)), vm)
  // }
  
}